<section class="about-section section-padding">
  <div class="section-header">
    <h2>关于甄成</h2>
    <div class="subtitle">ABOUT US</div>
  </div>
  <div class="about-content">
    <div class="about-image">
      <img src="images/icons/bg_company.png" alt="公司建筑" />
    </div>
    <div class="about-text">
      <h3>北京甄成商业集团有限公司</h3>
      <p class="pre">
        北京甄成商业集团有限公司（简称“甄成集团”）是一家立足北京，辐射全国的创新型企业生态服务商。甄成集团秉承“甄选、真诚、成就”的服务理念，努力搭建企业价值链赋能平台，目前平台已整合了企业资本运作、管理咨询与培训、市场拓展、招商服务、新媒体运营、先进科技支持等多方面服务与相关资源，形成了“企业管理“、”品牌运营“、”资本服务”“技术支持”四维联动的服务体系闭环，为全国各行业的企业提供战略级增长引擎。
        甄成集团正在邀请更多优质的企业项目、投资机构、企业咨询培训、先进科技等公司加入平台，为中国优质企业的高速发展保驾护航。</p>
      <a href="#" class="blue-btn">查看更多<img src="/images/icons/next.png" alt="Next"></a>
    </div>
  </div>
</section>
<!-- 关于甄成 公司介绍 -->
<style>
  /* 关于甄成 公司介绍 */
  .about-section {
    position: relative;
  }

  .about-content {
    max-width: 100rem;
    position: relative;
    width: 100%;
    max-width: 100rem;
    margin: 0 auto;
    box-sizing: border-box;
  }

  .about-content .about-image {
    z-index: -1;
    position: absolute;
    top: 6rem;
    left: 0;
    width: 100%;
    max-width: 52rem;
  }

  .about-image img {
    width: 100%;
    height: auto;
    max-height: 36.625rem;
    object-fit: cover;
  }

  .about-text {
    background: #222132;
    opacity: 0.95;
    padding: 4rem;
    float: right;
    width: calc(50% + 15rem);
    box-sizing: border-box;
    margin-bottom: 6rem
  }

  .about-text h3 {
    font-family: "Microsoft YaHei Bold";
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 3.25rem;
    color: #fff;
    margin-bottom: 0rem;
  }

  .about-text p {
    font-family: "Microsoft YaHei";
    font-weight: 400;
    font-size: 1rem;
    line-height: 2rem;
    color: #aaa;
  }

  /* 按钮样式 */
  .about-text .blue-btn {
    width: 12.5rem;
    height: 3.75rem;
    background: #0e78ff;
    font-family: "Microsoft YaHei";
    font-weight: 400;
    font-size: 1rem;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 2.5rem;
    text-decoration: none;
    border: none;
    transition: background-color 0.3s ease;
  }

  .blue-btn:hover {
    background: #0e8fff;
  }

  .blue-btn img {
    width: 1rem;
    height: 1rem;
    margin-left: 1rem;
    object-fit: contain;
  }

  /* 响应式样式 */
  @media screen and (max-width: 1200px) {
    .about-content {
      padding: 0 2rem;
    }

    .about-text {
      margin-left: 35rem;
      width: calc(100% - 35rem);
      margin-bottom: 0;
    }
  }

  @media screen and (max-width: 992px) {
    .about-content .about-image {
      position: relative;
      top: 0;
      max-width: 100%;
    }

    .about-text {
      margin-left: 0;
      width: 100%;
      margin-top: -5px;
      margin-bottom: 1rem;
    }

    .about-text h3 {
      font-size: 2rem;
      line-height: 2.75rem;
    }

    .about-text p {
      font-size: 1.125rem;
      line-height: 2.25rem;
    }

    .about-text .blue-btn {
      width: 11.5rem;
      height: 3.5rem;
      font-size: 1.125rem;
    }
  }

  @media screen and (max-width: 768px) {
    .about-content {
      padding: 0rem;
    }

    .about-text {
      padding: 2rem 1.5rem;
    }

    .about-text h3 {
      font-size: 1.75rem;
      line-height: 2.5rem;
    }

    .about-text p {
      font-size: 1rem;
      line-height: 2rem;
    }

    .about-text .blue-btn {
      width: 11rem;
      height: 3.25rem;
      font-size: 1.125rem;
      margin-top: 2rem;
    }

    .blue-btn img {
      width: 1.25rem;
      height: 1.25rem;
      margin-left: 0.75rem;
    }
  }
</style>